
import { Component, OnInit, ViewChild } from '@angular/core';
import 'rxjs/add/operator/map';
import { Observable } from 'rxjs/Rx';
import { CommService } from '../../comm/comm.service';
import { ReportUrls } from '../../comm/report.urls.conf';
import { QueryModel } from '../../model/report/query-model';
declare const $: any;
import { DxDropDownBoxComponent } from 'devextreme-angular';
import { TVResource } from '../../model/comm/tv-resource';
import * as Enumerable from 'linq';

@Component({
    selector: 'app-report-w-oee',
    templateUrl: './w-oee.component.html',
    styleUrls: ['./w-oee.component.scss']
})

export class WOEEComponent implements OnInit {
    title = '生产周报';
    public chartOption: any;

    public items: any[];

    /*生产线 - 班次*/
    public subAreaItems: any[];
    public subAreaSelected: any[];
    public shiftItems: any[];
    public shiftSelected: any;
    public equipemntItems: TVResource[] = [];
    public equipmentSelected: TVResource[];
    public templateItems: any[] = [];
    public templateSel;

    @ViewChild('ddda') ddda: DxDropDownBoxComponent;
    @ViewChild('dddb') dddb: DxDropDownBoxComponent;

    constructor(private commServices: CommService) {
    }

    ngOnInit() {
        this.commServices.initDatePicker($('#DateTimeRange'), 'YYYY-MM-DD');
        this.shiftItems = this.commServices.shifts;
        this.shiftSelected = this.shiftItems[0];
        this.subAreaItems = this.commServices.getSubAreas();
        this.subAreaSelected = [];
        this.equipemntItems = [];
        this.subAreaSelected.forEach(e => {
            const arr = this.commServices.getTVResourceBySubArea(e.subArea);
            arr.forEach(a => { this.equipemntItems.push(a); });
        });

        this.equipmentSelected = [];
        this.initTemplate();
    }

    initTemplate() {
        this.templateItems = [];
        this.templateSel = {};
        this.commServices
            .doGet(ReportUrls.ProdHourTemplateAreas2 + '/' + this.subAreaSelected[0].subArea)
            .subscribe(model => {
                if (model.resultCode === 200) {
                    this.templateItems = model.data;
                    this.templateSel = this.templateItems[0];
                } else {
                    alert(model.resultMessage);
                }
            });
    }

    clearSubAreaSelected() {
        this.subAreaSelected = [];
    }
    subAreaSelectedOk() {
        this.ddda.instance.close();
    }
    onSubAreaSelectedChange(subArea: any): void {
        this.equipemntItems = [];
        this.subAreaSelected.forEach(e => {
            const arr = this.commServices.getTVResourceBySubArea(e.subArea);
            arr.forEach(a => { this.equipemntItems.push(a); });
        });

        this.equipmentSelected = [];

        this.initTemplate();
    }
    clearEquipmentSelected() {
        this.equipmentSelected = [];
    }
    equipmentSelectedOk() {
        this.dddb.instance.close();
    }
    /**
     * 获取表格数据
     */
    getReportData(): void {
        const queryModel: QueryModel = new QueryModel();
        queryModel.dateTimeRange = this.getTime('DateTimeRange');
        queryModel.querySubAreaIds = this.subAreaSelected.map(e => e.subArea);
        queryModel.queryResourceIds = this.equipmentSelected.map(e => e.stationCode);
        queryModel.shift = this.shiftSelected.shiftId;
        queryModel.tag = this.templateSel.templateName;

        const axisLabel = [];
        const prodArrays = [];
        const restArrays = [];
        const targets = [];

        this.commServices
            .getList(queryModel, ReportUrls.PtrCnt2)
            .subscribe(model => {
                if (model.resultCode === 200) {
                    model.data.oee = Enumerable.from((model.data.oee)).orderBy((e: any) => e.prodDateVal0).thenBy((e: any) => e.shiftVal0);
                    model.data.oee.forEach(item => {
                        axisLabel.push(item.prodDateVal0 + '-' + (item.shiftVal0 === 1 ? '早' : item.shiftVal0 === 2 ? '中' : '晚') + '班');
                        const prod = item.hourVal1 + item.hourVal2 + item.hourVal3 + item.hourVal4 + item.hourVal5 + item.hourVal6
                            + item.hourVal7 + item.hourVal8 + item.hourVal9 + item.hourVal10 + item.hourVal11;
                        const rest = item.hourVal1Rest + item.hourVal2Rest + item.hourVal3Rest + item.hourVal4Rest
                            + item.hourVal5Rest + item.hourVal6Rest + item.hourVal7Rest + item.hourVal8Rest + item.hourVal9Rest
                            + item.hourVal10Rest + item.hourVal11Rest;
                        prodArrays.push(prod - rest);
                        restArrays.push(rest);
                        targets.push(item.hourVal1Jph + item.hourVal2Jph + item.hourVal3Jph + item.hourVal4Jph + item.hourVal5Jph
                            + item.hourVal6Jph + item.hourVal7Jph + item.hourVal8Jph
                            + item.hourVal9Jph + item.hourVal10Jph + item.hourVal11Jph);
                    });
                    this.chartOption = {
                        title:{
                            text:this.subAreaSelected[0].subArea+' / '+this.equipmentSelected[0].stationCode,
                        },
                        tooltip: {
                            trigger: 'axis',
                            axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                                type: 'line'        // 默认为直线，可选为：'line' | 'shadow'
                            }
                        },
                        toolbox: {
                            feature: {
                                saveAsImage: {}
                            }
                        },
                        legend: {
                            data: ['实际产量', '计划产量', '额外产量']
                        },
                        grid: {
                            left: '3%',
                            right: '4%',
                            bottom: '3%',
                            containLabel: true
                        },
                        xAxis: [
                            {
                                type: 'category',
                                data: axisLabel
                            }
                        ],
                        yAxis: [
                            {
                                type: 'value'
                            }
                        ],
                        series: [
                            {
                                name: '实际产量',
                                type: 'bar',
                                stack: '广告',
                                data: prodArrays,
                                label: {
                                    normal: {
                                        show: true,
                                        color: 'black',
                                        //position: 'insideRight'
                                    }
                                },
                                itemStyle: {
                                    normal: { color: '#92D050' },
                                }
                            },
                            {
                                name: '计划产量',
                                type: 'line',
                                data: targets,
                                label: {
                                    normal: {
                                        show: true,
                                        position: 'top'
                                    }
                                },
                                itemStyle: {
                                    normal: { color: '#0000CC' },
                                }
                            },
                            {
                                name: '额外产量',
                                type: 'bar',
                                stack: '广告',
                                data: restArrays,
                                label: {
                                    normal: {
                                        show: true,
                                        //position: 'insideRight'
                                    }
                                },
                                itemStyle: {
                                    normal: { color: '#FFFF00' },
                                }
                            }
                        ]
                    };

                }
            });
    }

    getTime(id: any): String {
        return $('#' + id).val();
    }

    /**ECharts图表相关*/
    // tslint:disable-next-line:member-ordering
    chartsMap = new Map<any, any>();
    onChartInit(index: any, echartsIntance: any): void {
        this.chartsMap.set(index, echartsIntance);
        Observable.fromEvent(window, 'resize')
            .debounceTime(100) // 以免频繁处理
            .subscribe((event) => this.chartsMap.forEach((v, k) => v.resize()));
    }
}
